<template>
	<div style="display: flex; align-items: center; width: 720px; margin: auto">
		<el-table :data="wdDataList" border>
			<el-table-column prop="no" label="编号"/>
			<el-table-column prop="name" label="名称" width="200" />
			<el-table-column prop="currentValue" label="参数值" width="180">
				<template #default="scope">
					{{ scope.row.currentValue + '/' + scope.row.unit }}
				</template>
			</el-table-column>
			<el-table-column label="报警值" width="180">
				<template #default="scope">
					{{ scope.row.warningValue + '/' + scope.row.unit }}
				</template>
			</el-table-column>
			<el-table-column prop="point" label="状态">
				<template #default="scope">
					<CardDataPoint
						:data="scope.row.currentValue"
						:point="scope.row.warningValue"
						:open="scope.row.symbol"
						top="7"
						left="5"></CardDataPoint>
				</template>
			</el-table-column>
		</el-table>
	</div>
</template>

<script setup>
import CardDataPoint from '@/components/CardDataPoint.vue'
import labTable from '@/mixins/table.json'
let { meta } = useRoute()
console.log(meta.id)
let id = meta.id
let allData = inject('allData')
let wdDataList = ref([])
watch(
	() => allData.value,
	(newVal, oldVal) => {
		let tmpData = id == 1 ? newVal.left_main : newVal.right_main
		let tmpJson = id == 1 ? labTable.left_main : labTable.right_main
		tmpData = tmpData || {}
		let datakey = Object.keys(tmpData).filter((item) => {
			// console.log(tmpJson[item] ?? 222);
			return tmpJson[item] ? tmpJson[item].name.slice(-2) == "温度" : false 
		})
		let dataList = []
		datakey.forEach((item, index) => {
			let tmpJson = id == 1 ? labTable.left_main : labTable.right_main
			tmpData[item].unit = tmpJson[item].unit
			tmpData[item].name = tmpJson[item].name
			tmpData[item].no = tmpJson[item].no
			if(tmpData[item].name.slice(-4) == "轴承温度" || tmpData[item].name.slice(-4) == "排气温度"){
				return false
			}
			dataList.push(tmpData[item])
		})
		dataList.sort((p,n)=>{
			return +(p.columnname.substring(1)) - +(n.columnname.substring(1))
		})
		wdDataList.value = dataList
		console.log(wdDataList.value)
	},
	{
		deep: true
	}
)
</script>

<style scoped></style>
